<template>
  <div class="apirequestbody">
      <div class="requestbodydiv" style="float: left">
        <span class="requestbodyspan1">&nbsp;REST 参数</span>
        <!--<span class="requestbodyspan2 fs12 plr5 ptb2 mr5">JSON</span>-->
        <!--<span class="requestbodyspan2 fs12 plr5 ptb2 mr5">最外层结构为：Object</span>-->
        <span class="requestbodyspan3 fs12 plr5 ptb2 mr5">生成预览数据</span>
      </div>
    <!--<div class="searchIten" style="float: right">-->
      <!--<span class="selectBtn"><i class="iconfont">&#xe605;</i>列表项</span>-->
    <!--</div>-->
    <div>
      <el-table
        :data="tableData"
        size="small"
        border
        class="elementTable"
        header-cell-class-name="elementTableHeader"
        cell-class-name="elementTableBody"
        highlight-current-row>
        <el-table-column  width="300" align="center" label="参数名">
          <template slot-scope="scope">
            {{scope.row.name}}
          </template>
        </el-table-column>
        <el-table-column   width="150" align="center" label="类型" prop="type"></el-table-column>
        <el-table-column   align="center" label="必含">
          <template slot-scope="scope" >
            <span v-if="scope.row.required==1">是</span>
            <span v-else>否</span>
          </template>
        </el-table-column>
        <!--<el-table-column  width="150"-->
                          <!--align="center"-->
                          <!--label="类型"-->
                          <!--prop="type"-->
                          <!--:filters="[{ text: '[string]', value: '[string]' }]"-->
                          <!--:filter-method="filterTag">-->
        <!--</el-table-column>-->
        <!--<el-table-column  width="100" align="center" label="必含" prop="required"-->
                          <!--:filters="[{ text: '是', value: '是' },{ text: '否', value: '否' }]"-->
                          <!--:filter-method="filterRequired"></el-table-column>-->
        <el-table-column  width="300" align="center" label="说明" prop="remarks"></el-table-column>
        <el-table-column  width="300" align="center" label="限制" prop="verification"></el-table-column>
        <el-table-column   align="center" label="示例" prop="demo"></el-table-column>
        <el-table-column   width="150" align="center"  label="全部展开" >
          <template slot-scope="scope">
            <span  v-if="control" @click="oncontrol" style="color: #00a0e9">展开</span>
            <span  v-else @click="oncontrol1" style="color: #00a0e9">收缩</span>
          </template>
        </el-table-column>
      </el-table>
  </div>
  </div>
</template>

<script>
  export default {
    name: 'apiState',
    props: {
      form: {},
      editData: {}
    },
    data() {
      return {
        control: true,
        tableData: [],
        dataArr: this.form
      }
    },
    created() {
      // REST 参数
      this.tableData = this.editData.restfulParam
    },
    methods: {
      oncontrol() {
        this.control = false
      },
      oncontrol1() {
        this.control = true
      },
      filterTag(value, row) {
        return row.type === value
      },
      filterRequired(value, row) {
        return row.required === value
      },
      burlChangeVal() {
        this.$emit('changeFormFun', this.dataArr)
      }
    }
  }
</script>

<style scoped>
</style>
